﻿<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    <!-- Latest Bootstrap min CSS -->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css" type="text/css">
    <!-- Dropdownhover CSS -->
    <link rel="stylesheet" href="assets/css/bootstrap-dropdownhover.min.css" type="text/css">
    <!-- latest fonts awesome -->
    <link rel="stylesheet" href="assets/font/css/font-awesome.min.css" type="text/css">
    <!-- simple line fonts awesome -->
    <link rel="stylesheet" href="assets/simple-line-icon/css/simple-line-icons.css" type="text/css">
    <!-- stroke-gap-icons -->
    <link rel="stylesheet" href="assets/stroke-gap-icons/stroke-gap-icons.css" type="text/css">
    <!-- Animate CSS -->
    <link rel="stylesheet" href="assets/css/animate.min.css" type="text/css">
    <!-- Style CSS -->
    <link rel="stylesheet" href="assets/css/style.css" type="text/css">
    <!-- Style CSS -->
    <link rel="stylesheet" href="assets/css/slider.css" type="text/css">
    <!--  baguetteBox -->
    <link rel="stylesheet" href="assets/css/baguetteBox.css">
    <!-- Owl Carousel Assets -->
    <link href="assets/owl-carousel/owl.carousel.css" rel="stylesheet">
    <link href="assets/owl-carousel/owl.theme.css" rel="stylesheet">
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
<!-- 导入页眉 -->
<div class="header"></div>
<section class="shopping-cart">
    <!-- .shopping-cart -->

    <!-- 按钮触发模态框 -->
    <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">增加新地址</button>
    <!-- 模态框（Modal） -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">地址信息</h4>
                </div>
                <div class="modal-body">
                    <!--                    &lt;!&ndash;三级联动开始&ndash;&gt;-->
                    <!--                    <div id="demo3" class="citys">-->
                    <!--                        <p>-->
                    <!--                            <select name="province" id="province"></select>-->
                    <!--                            <select name="city"></select>-->
                    <!--                            <select name="area"></select>-->
                    <!--                            <select name="town"></select>-->
                    <!--                        </p>-->
                    <!--                    </div>-->

                    <!--                    &lt;!&ndash;三级联动结束&ndash;&gt;-->
                </div>
                <!--地址信息表单开始-->
                <form>
                    <!--三级联动开始-->
                    <div id="demo3" class="citys">
                        <p>
                            <select name="province" id="province"></select>
                            <select name="city" id="city"></select>
                            <select name="area" id="area"></select>
                            <select name="town" id="town"></select>
                        </p>
                    </div>

                    <!--三级联动结束-->
                    <div class="form-group">
                        <label for="inputAddress">详细地址</label>
                        <input type="text" class="form-control" id="inputAddress" placeholder="1234 Main St">
                    </div>
                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="name">收货人名字</label>
                            <input type="text" class="form-control" id="name" placeholder="名字">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="phone">收货号码</label>
                            <input type="text" class="form-control" id="phone" placeholder="号码">
                        </div>
                    </div>
                    <!--                    <div class="form-group">-->
                    <!--                        <label for="inputAddress2">Address 2</label>-->
                    <!--                        <input type="text" class="form-control" id="inputAddress2"-->
                    <!--                               placeholder="Apartment, studio, or floor">-->
                    <!--                    </div>-->
                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="code">邮编</label>
                            <input type="text" class="form-control" id="code">
                        </div>
                        <div class="form-group col-md-4">
                            <label for="inputZip">街道补充</label>
                            <input type="text" class="form-control" id="inputZip1">

                        </div>
                        <div class="form-group col-md-2">
                            <label for="inputZip">街道补充</label>
                            <input type="text" class="form-control" id="inputZip">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" id="gridCheck">
                            <label class="form-check-label" for="gridCheck">
                                Check me out
                            </label>
                        </div>
                    </div>
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="submit" class="btn btn-primary" onclick=" addAddress()">提交地址</button>
                </form>
                <!--地址信息表单结束-->
                <!--                <div class="modal-footer">-->
                <!--                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>-->
                <!--                    <button type="button" class="btn btn-primary">提交地址</button>-->
                <!--                </div>-->
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
    <!--展示用户地址信息开始-->
    <div id="div_vue">
        <table class="table">
            <thead>
            <tr>
                <th scope="col">所在省</th>
                <th scope="col">详细地址</th>
                <th scope="col">收货人</th>
                <th scope="col">收货号码</th>
            </tr>
            </thead>
            <tbody>
            <tr v-for="address in addressList">
                <td scope="row">{{address.addressProvince}}</td>
                <td scope="row">{{address.addressDetails}}</td>
                <td scope="row">{{address.receivingName}}</td>
                <td scope="row">{{address.receivingPhone}}</td>
                <td>
                    <button type="button" class="btn btn-primary" @click="selectaddress(address.id,orderList.id)">选择地址</button>
                </td>
                <td>
                    <button type="button" class="btn btn-primary" @click="modification(address.id)">修改地址</button>
                </td>
                <td>
                    <button type="button" class="btn btn-primary" @click="toAsDefault(address.id)">设为默认</button>
                </td>
                <td>
                    <button type="button" class="btn btn-primary" @click="toDetail(address.id)">删除地址</button>
                </td>
            </tr>
            </tbody>
        </table>
        <!--展示用户地址信息结束-->

        <div>
            <!--修改地址-->
            <div style="display: none" id="toDetail2">
                <form>
                    <!--三级联动开始-->
                    <div id="demo4" class="citys">
                        <p>
                            <select name="province" id="province1"></select>
                            <select name="city" id="city1"></select>
                            <select name="area" id="area1"></select>
                            <select name="town" id="town1"></select>
                        </p>
                    </div>

                    <!--三级联动结束-->
                    <div class="form-group">
                        <label for="inputAddress">详细地址</label>
                        <input type="text" class="form-control" id="inputAddress1"
                               placeholder="1234 Main St" :value="addressModify.addressDetails">
                    </div>
                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="name">收货人名字</label>
                            <input type="text" class="form-control" id="name1" placeholder="名字"
                                   :value="addressModify.receivingName">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="phone">收货号码</label>
                            <input type="text" class="form-control" id="phone1" placeholder="号码"
                                   :value="addressModify.receivingPhone">
                        </div>
                    </div>
                    <!--                    <div class="form-group">-->
                    <!--                        <label for="inputAddress2">Address 2</label>-->
                    <!--                        <input type="text" class="form-control" id="inputAddress2"-->
                    <!--                               placeholder="Apartment, studio, or floor">-->
                    <!--                    </div>-->
                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="code">邮编</label>
                            <input type="text" class="form-control" id="code1" :value="addressModify.postalCode">
                        </div>
                        <div class="form-group col-md-4">
                            <label for="inputZip">街道补充</label>
                            <input type="text" class="form-control" id="inputZip11">

                        </div>
                        <div class="form-group col-md-2">
                            <label for="inputZip">街道补充</label>
                            <input type="text" class="form-control" id="inputZip111" :value="addressModify.id">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" id="gridCheck1">
                            <label class="form-check-label" for="gridCheck">
                                Check me out
                            </label>
                        </div>
                    </div>
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" v-on:click=" newAddress()">提交地址</button>
                </form>
            </div>
        </div>
        <!--修改地址结束-->
        <!--商品订单展示开始-->
        <div>
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th scope="col">宝贝名字</th>
                    <th scope="col">单价</th>
                    <th scope="col">数量</th>
                    <th scope="col">小计</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>{{nowGoods.name}}</td>
                    <td>{{nowGoods.currentPrice}}</td>
                    <td>1</td>
                    <td>{{nowGoods.currentPrice}}</td>
                    <td>
                        <button type="button" class="btn btn-primary" @click="ConfirmOrder(orderList.id)">确认订单</button>
                    </td>
                </tr>
            </table>
        </div>
        <!--商品订单展示结束-->
        <!--确认订单开始-->
        <div style="display:none;" id="confirm">
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th scope="col">详细地址</th>
                    <th scope="col">收货人</th>
                    <th scope="col">收货号码</th>
                    <th scope="col">商品名字</th>
                    <th scope="col">宝贝单价</th>
                    <th scope="col">商品数量</th>
                    <th scope="col">总价</th>
                    <th scope="col">确认完毕点击下方支付</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>{{confirmInformation.addressDetails}}</td>
                    <td>{{confirmInformation.receivingName}}</td>
                    <td>{{confirmInformation.receivingPhone}}</td>
                    <td>{{confirmInformation.goodsName}}</td>
                    <td>{{confirmInformation.originalPrice}}</td>
                    <td>{{confirmInformation.goodsNumber}}</td>
                    <td>{{confirmInformation.sonOrderAmout}}</td>
                    <td>
                        <button type="button" class="btn btn-primary" @click="toPay(orderList.parentsOrderId)">支付
                        </button>
                    </td>
                </tr>
            </table>
        </div>
        <!--确认订单结束-->


        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="#">返回主页</a></li>
                        <li class="breadcrumb-item active">结算</li>
                    </ol>
                </div>
                <div class="col-md-12">
                    <!-- Accordions -->

                    <div id="collapse6" class="panel-collapse collapse">
                        <div class="panel-body">
                            <div id="checkout-step-review" class="step a-item" style="">
                                <div class="order-review" id="checkout-review-load">
                                    <div id="checkout-review-table-wrapper">
                                        <table class="data-table linearize-table checkout-review-table"
                                               id="checkout-review-table">
                                            <thead>
                                            <tr class="first last">
                                                <th rowspan="1">Product</th>
                                                <th colspan="1" class="a-center">Price</th>
                                                <th rowspan="1" class="a-center">Qty</th>
                                                <th colspan="1" class="a-center">Subtotal</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr class="first">
                                                <td style="" class="a-right" colspan="3">
                                                    Subtotal
                                                </td>
                                                <td style="" class="a-right last">
                                                    <span class="price">$989.00</span>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td style="" class="a-right" colspan="3">
                                                    Shipping &amp; Handling (Flat Rate - Fixed)
                                                </td>
                                                <td style="" class="a-right last">
                                                    <span class="price">$5.00</span>
                                                </td>
                                            </tr>
                                            <tr class="last">
                                                <td style="" class="a-right" colspan="3">
                                                    <strong>Grand Total</strong>
                                                </td>
                                                <td style="" class="a-right last">
                                                    <strong><span class="price">$994.00</span></strong>
                                                </td>
                                            </tr>
                                            <tr class="first last odd">
                                                <td>
                                                    <h3 class="product-name">Outsunny 9-Piece Outdoor PE Rattan
                                                        Wicker </h3>
                                                    <dl class="item-options">
                                                        <dt>Color</dt>
                                                        <dd>black</dd>
                                                        <dt>Size</dt>
                                                        <dd>47L x 104W x 33.5H</dd>
                                                        <dt>Bounce</dt>
                                                        <dd>Water &amp; UV Resistant</dd>
                                                        <dt>Material</dt>
                                                        <dd>Rattan</dd>
                                                    </dl>
                                                </td>
                                                <td class="a-right" data-rwd-label="Price">
                                             <span class="cart-price">
                                             <span class="price">$989.00</span>            
                                             </span>
                                                </td>
                                                <td class="a-center" data-rwd-label="Qty">1</td>
                                                <!-- sub total starts here -->
                                                <td class="a-right last" data-rwd-label="Subtotal">
                                             <span class="cart-price">
                                             <span class="price">$989.00</span>            
                                             </span>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                    <div id="checkout-review-submit">
                                        <div class="buttons-set" id="review-buttons-container">
                                            <button type="submit" title="Place Order" class="button btn-checkout">Place
                                                Order
                                            </button>
                                            <p class="f-left">Forgot an Item? <a href="#">Edit Your Cart</a></p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <!-- /.shopping-cart -->
</section>
<!-- 导入页脚 -->
<div class="footer"></div>
<!-- sticky-socia -->
<aside id="sticky-social">
    <ul>
        <li><a href="#" class="fa fa-facebook" target="_blank"><span><i class="fa fa-facebook" aria-hidden="true"></i> Facebook</span></a>
        </li>
        <li><a href="#" class="fa fa-twitter" target="_blank"><span><i class="fa fa-twitter" aria-hidden="true"></i> Twitter</span></a>
        </li>
        <li><a href="#" class="fa fa-rss" target="_blank"><span><i class="fa fa-rss" aria-hidden="true"></i> RSS</span></a>
        </li>
        <li><a href="#" class="fa fa-pinterest-p" target="_blank"><span><i class="fa fa-pinterest-p"
                                                                           aria-hidden="true"></i> Pinterest</span></a>
        </li>
        <li><a href="#" class="fa fa-share-alt" target="_blank"><span><i class="fa fa-share-alt" aria-hidden="true"></i> Flickr</span></a>
        </li>
    </ul>
</aside>
<!-- /sticky-socia -->
<p id="back-top"><a href="#top"><i class="fa fa-chevron-up" aria-hidden="true"></i></a></p>
<script src="assets/js/jquery.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/bootstrap-dropdownhover.min.js"></script>
<!-- Plugin JavaScript -->
<script src="assets/js/jquery.easing.min.js"></script>
<script src="assets/js/wow.min.js"></script>
<!-- owl carousel -->
<script src="assets/owl-carousel/owl.carousel.js"></script>
<!--  Custom Theme JavaScript  -->
<script src="assets/js/filter-price.js"></script>
<script src="assets/js/custom.js"></script>
<script src="assets/js/util/http-util.js"></script>
<!--  vue  -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="assets/js/util/http-util.js"></script>
<script src="assets/js/jquery.cities.js"></script>
</body>

</html>
<script type="text/javascript">
    //在js中引入页眉页脚
    $(document).ready(function () {
        $('.header').load('header.html');
        $('.footer').load('footer.html');
    });
    var goodsId = null;
    var vmi = new Vue({
        el: '#div_vue',
        data: {
            addressList: [],
            addressModify: "",
            orderList: [],
            nowGoods: [],
            nowGoodsId: "",
            confirmInformation:"",
        },
        methods: {
            refreshArticleList: function () {
                //发起http请求后台获取文章列表数据
                let url = "userAllAddress";
                let thisObj = this;
                doGet(url, function (data) {
                    console.log(data);
                    thisObj.addressList = data;
                })
            },
            selectaddress :function(id1,id2){
              let url = "selectaddress";
              let parm = {id1:id1,id2:id2};
              getWithParams(url,parm,function () {
                  alert("选择地址成功");
              })
            },


            toAsDefault: function (id) {
                console.log("进入设置默认方法");
                let url = "setAsDefault";
                let params = {addressId: id};
                getWithParams(url, params, function (resp) {
                    console.log(resp);
                    alert("设置为默认成功");
                });
            },
            toDetail: function (id) {
                console.log("进入删除方法");
                let url = "delectAddress";
                let params = {addressId: id};
                let goodsId = this.getUrlParam("id");
                getWithParams(url, params, function (resp) {
                    console.log(resp);
                    alert("删除地址成功");
                    location.href = "checkout-single.html?id="+goodsId;
                });
            },
            modification: function (id) {
                console.log("修改地址方法");
                $("#toDetail2").toggle();
                let url = "selectOneAddress";
                let params = {addressId: id};
                let thisObj = this;
                getWithParams(url, params, function (resp) {
                    thisObj.addressModify = resp;
                    console.log(resp);
                });
            },
            toPay: function (id) {
                console.log("父订单: "+id)
                let url ="http://localhost:8080/shop_api/to_pay";
                let parm = {id : id};
                $.ajax({
                    url: url,
                    type: 'post',
                    data: parm,
                    success: function(resp) {
                        console.log(resp);
                        $('body').html(resp);
                    }
                })
            },
            ConfirmOrder: function (id) {
                let uel = "/ConfirmOrderSingle";
                let parm = {id: id};
                $("#confirm").toggle("fast");
                doPost(uel, parm, function (resp) {
                    thisObj.confirmInformation=resp;
                })
            },
            getUrlParam: function (name) {
                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
                var r = window.location.search.substr(1).match(reg);  //匹配目标参数
                if (r != null) return unescape(r[2]);
                return null; //返回参数值
            },
            getGoodsId: function () {
                thisObj = this;
                let id = this.getUrlParam("id");
                goodsId = id;
                console.log("goodsid:" + goodsId);
            },
            getGoods: function () {
                let url = "detail/goods/" + goodsId;
                this.nowGoodsId = goodsId;
                let goodsObj = this;
                doGet(url, function (resp) {
                    goodsObj.nowGoods = resp;
                    //发起http请求生成订单
                    let url1 = "generateOrdersSingle";
                    let parms = {
                        goodsId: resp.id,
                        goodsName: resp.name,
                        goodsNumber: 1,
                        originalPrice: resp.currentPrice
                    };
                    doPost(url1, parms, function (data) {
                        goodsObj.orderList = data;
                    })
                });
            },
            newAddress: function () {
                console.log("进入修改收货地址方法");
                let province = $("#province1 ").val();
                let city = $("#city1 ").val();
                let area = $("#area1").val();
                console.log(province + city + area);
                let inputAddress = $("#inputAddress1").val();
                let name = $("#name1").val();
                let phone = $("#phone1").val();
                let code = $("#code1").val();
                let id = $("#inputZip111").val();
                if (province1 == "") {
                    alert("省份不能为空");
                    return false;
                }
                if (city1 == "") {
                    alert("城市不能为空");
                    return false;
                }
                if (inputAddress1 == "") {
                    alert("详细地址不能为空");
                    return false;
                }
                if (name1 == "") {
                    alert("收货人不能为空");
                    return false;
                }
                if (phone1 == "") {
                    alert("收货密码不能为空");
                    return false;
                }
                if (code1 == "") {
                    alert("邮编不能为空");
                    return false;
                }
                let url = "updateAddress";
                let goodsId = this.getUrlParam("id");
                let parm = {
                    addressProvince: province, addressCity: city, addressDistrict: area, receivingName: name,
                    receivingPhone: phone, postalCode: code, addressDetails: inputAddress, id: id
                };
                doPost(url, parm, function () {
                    alert("修改地址成功");
                    location.href = "checkout-single.html?id=" + goodsId;
                })
            },
            // addAddress: function () {
            //     console.log("进入收货地址方法");
            //     let province = $("#province ").val();
            //     let city = $("#city ").val();
            //     let area = $("#area").val();
            //     console.log(province + city + area);
            //     let inputAddress = $("#inputAddress").val();
            //     let name = $("#name").val();
            //     let phone = $("#phone").val();
            //     let code = $("#code").val();
            //     if (province == "") {
            //         alert("省份不能为空");
            //         return false;
            //     }
            //     if (city == "") {
            //         alert("城市不能为空");
            //         return false;
            //     }
            //     if (inputAddress == "") {
            //         alert("详细地址不能为空");
            //         return false;
            //     }
            //     if (name == "") {
            //         alert("收货人不能为空");
            //         return false;
            //     }
            //     if (phone == "") {
            //         alert("收货密码不能为空");
            //         return false;
            //     }
            //     if (code == "") {
            //         alert("邮编不能为空");
            //         return false;
            //     }
            //     let url = "addAddress";
            //     let goodsId = this.getUrlParam("id");
            //
            //     let parm = {
            //         addressProvince: province, addressCity: city, addressDistrict: area, receivingName: name,
            //         receivingPhone: phone, postalCode: code, addressDetails: inputAddress
            //     };
            //     doPost(url, parm, function () {
            //         alert("提交成功");
            //         location.href = "checkout-single.html"+goodsId;
            //     })
            // }
        },
        mounted: function () {
            this.getGoodsId();
            this.getGoods();
            //页面加载完成，并且vue对象加载完成之后调用
            this.refreshArticleList();

        },
        created: function () {
            console.log("created");
        }
    });

    <!--vue渲染结束-->

    function addAddress() {
        console.log("进入收货地址方法");
        let province = $("#province ").val();
        let city = $("#city ").val();
        let area = $("#area").val();
        console.log(province + city + area);
        let inputAddress = $("#inputAddress").val();
        let name = $("#name").val();
        let phone = $("#phone").val();
        let code = $("#code").val();
        if (province == "") {
            alert("省份不能为空");
            return false;
        }
        if (city == "") {
            alert("城市不能为空");
            return false;
        }
        if (inputAddress == "") {
            alert("详细地址不能为空");
            return false;
        }
        if (name == "") {
            alert("收货人不能为空");
            return false;
        }
        if (phone == "") {
            alert("收货密码不能为空");
            return false;
        }
        if (code == "") {
            alert("邮编不能为空");
            return false;
        }
        let url = "addAddress";
        let urlGoodsId=window.location.href;
        let id=urlGoodsId.substring(urlGoodsId.lastIndexOf('=') + 1);
        console.log(id);
        let parm = {
            addressProvince: province, addressCity: city, addressDistrict: area, receivingName: name,
            receivingPhone: phone, postalCode: code, addressDetails: inputAddress
        };
        doPost(url, parm, function () {
            alert("提交成功");
            location.href = "checkout-single.html?id="+id;
        })
    }

    /*function newAddress() {
        console.log("进入修改收货地址方法");
        let province = $("#province1 ").val();
        let city = $("#city1 ").val();
        let area = $("#area1").val();
        console.log(province + city + area);
        let inputAddress = $("#inputAddress1").val();
        let name = $("#name1").val();
        let phone = $("#phone1").val();
        let code = $("#code1").val();
        let id = $("#inputZip111").val();
        if (province1 == "") {
            alert("省份不能为空");
            return false;
        }
        if (city1 == "") {
            alert("城市不能为空");
            return false;
        }
        if (inputAddress1 == "") {
            alert("详细地址不能为空");
            return false;
        }
        if (name1 == "") {
            alert("收货人不能为空");
            return false;
        }
        if (phone1 == "") {
            alert("收货密码不能为空");
            return false;
        }
        if (code1 == "") {
            alert("邮编不能为空");
            return false;
        }
        let url = "updateAddress";
        let goodsId=vm.$options.methods.getUrlParam("id");
        let parm = {
            addressProvince: province, addressCity: city, addressDistrict: area, receivingName: name,
            receivingPhone: phone, postalCode: code, addressDetails: inputAddress, id: id
        };
        doPost(url, parm, function () {
            alert("修改地址成功");
            location.href = "checkout-single.html?id="+goodsId;
        })
    }*/


</script>

<script type="text/javascript">
    var selectedAddress = {'province': '', 'city': '', 'area': '', 'town': ''};
    var $town = $('select[name="town"]');
    var clearTown = function () {
        $town.hide().empty();
    };
    var townFormat = function (info) {
        clearTown();
        if (info['code'] % 1e4 && info['code'] < 7e5) {	//是否为“区”且不是港澳台地区
            $.ajax({
                url: 'http://passer-by.com/data_location/town/' + info['code'] + '.json',
                dataType: 'json',
                success: function (town) {
                    $town.show();
                    $town.append('<option value=""> - 街道、乡镇 - </option>');
                    for (i in town) {
                        $town.append('<option value="' + town[i] + '">' + town[i] + '</option>');
                    }
                }
            });
        }
    };
    $('#demo3').citys({
        onChange: function (info) {
            clearTown();
            selectedAddress.province = info.province;
            selectedAddress.city = info.city;
            selectedAddress.area = info.area;
        },
        onAreaChange: function (info) {
            townFormat(info);
        }
    }, function (api) {
        var info = api.getInfo();
        townFormat(info);
    });
    $town.on('change', function () {
        selectedAddress.town = $(this).find("option:selected").text();
    });

    console.log(selectedAddress); //输出最终选择的省、市、区县、街道
</script>
<script type="text/javascript">
    var selectedAddress = {'province': '', 'city': '', 'area': '', 'town': ''};
    var $town = $('select[name="town"]');
    var clearTown = function () {
        $town.hide().empty();
    };
    var townFormat = function (info) {
        clearTown();
        if (info['code'] % 1e4 && info['code'] < 7e5) {	//是否为“区”且不是港澳台地区
            $.ajax({
                url: 'http://passer-by.com/data_location/town/' + info['code'] + '.json',
                dataType: 'json',
                success: function (town) {
                    $town.show();
                    $town.append('<option value=""> - 街道、乡镇 - </option>');
                    for (i in town) {
                        $town.append('<option value="' + town[i] + '">' + town[i] + '</option>');
                    }
                }
            });
        }
    };
    $('#demo4').citys({
        onChange: function (info) {
            clearTown();
            selectedAddress.province = info.province;
            selectedAddress.city = info.city;
            selectedAddress.area = info.area;
        },
        onAreaChange: function (info) {
            townFormat(info);
        }
    }, function (api) {
        var info = api.getInfo();
        townFormat(info);
    });
    $town.on('change', function () {
        selectedAddress.town = $(this).find("option:selected").text();
    });

    console.log(selectedAddress); //输出最终选择的省、市、区县、街道
</script>
<script>

</script>